今天是第六天,那就來寫一下學程式的必經之路Hello World吧
首先是先建立一個.html,接著再按照第三天的步驟引入Vue
這裡是HTML的部分
<div id="app">
<h2>{{message}}</h2>
<h2>{{text}}</h2>
<h2>{{name}}</h2>
</div>
這裡是JS的部分
<script>
const app ={
data(){
return{
message:'hello world!!!',
text:'Vue',
name:'george'
}
}
}
Vue.createApp(app).mount('#app')
</script>
data 的資料會到 html 元素中,使用Mustache語法{{}},將 data 資料包在裡面,HTML將會讀取到Vue data
結果如下
簡單應用就分享到這邊,我們第七天見